<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<meta charset="UTF-8">
	<link rel="shortcut icon" href="favicon.ico">
	<link rel="stylesheet" href="css/iconfont.css">
	<link rel="stylesheet" href="css/global.css">
	<link rel="stylesheet" href="css/bootstrap.min.css">
	<link rel="stylesheet" href="css/bootstrap-theme.min.css">
	<link rel="stylesheet" href="css/swiper.min.css">
	<link rel="stylesheet" href="css/styles.css">
	<script src="js/jquery.1.12.4.min.js" charset="UTF-8"></script>
	<script src="js/bootstrap.min.js" charset="UTF-8"></script>
	<script src="js/swiper.min.js" charset="UTF-8"></script>
	<script src="js/global.js" charset="UTF-8"></script>
	<script src="js/jquery.DJMask.2.1.1.js" charset="UTF-8"></script>
	<script src="js/vue.js"></script>
	<script src="js/axios.min.js"></script>
	<script type="text/javascript">
		$(function(){
			new Vue({
				el: "#app",
				data: {
					user:{
						name:"",
						account:"",
						score:"",
						moeny:"",
						head:""
					},
					orders:[],
					orderCount:{
						all:"",
						waitPay:"",
						waitSend:"",
						waitReceive:"",
						waitWrite:"",
					},

				},
				methods:{
					setUser(){
						localStorage.setItem("user666",JSON.stringify(this.user));
					},
					orderList(statusNo){
						let user = localStorage.getItem("userz"); //查询对应的商品组
						axios.get("http://192.168.6.125:8080/order/list/"+statusNo,user).then(response=> {
							if (response.data.code==200) {
								this.orders = response.data.data;
							}else{
								alert("错误:"+response.data.msg);
							}
						})
					},

				},
				mounted: function () {
					 let user = JSON.parse(localStorage.getItem("userz"));

					axios.post("http://192.168.6.125:8080/user/getUser",user).then(response=> {
						if (response.data.code == 200) {
							this.user=response.data.data;
						}

						axios.post("http://192.168.6.125:8080/order/getCount",this.user).then(response=> {
							if (response.data.code==200) {
								this.orderCount=response.data.data;
							}else{
								alert("错误:"+response.data.msg);
							}
						})

						axios.post("http://192.168.6.125:8080/order/list/0",this.user).then(response=> {
							if (response.data.code==200) {
								this.orders = response.data.data;
							}else{
								alert("错误:"+response.data.msg);
							}
						})
					})



				}
			});
		})


	</script>
</head>
<body class="bgf5">
<div id="app">
	<div class="pull-right" >
				<div class="user-center__info bgf">
					<div class="pull-left clearfix">
						<div class="port b-r50 pull-left">
							<img :src="user.head" alt="用户名" class="cover b-r50">
							<a href="uinfo.html" target="right" class="edit"><i class="iconfont icon-edit"></i></a>
						</div>
						<p class="name text-nowrap">您好，{{user.name}} </p>
						<p class="money text-nowrap">余额：{{user.money}}</p>
						<p class="level text-nowrap">身份：<a href="agent_level.html">提升</a></p>
					</div>
					<div class="pull-right user-nav">
						<a href="udai_order.html" class="user-nav__but">
							<i class="iconfont icon-rmb fz40 cr"></i>
							<div class="c6">待支付 <span class="cr">{{orderCount.waitPay}}</span></div>
						</a>
						<a href="udai_order.html" class="user-nav__but">
							<i class="iconfont icon-eval fz40 cr"></i>
							<div class="c6">待评价 <span class="c3">{{orderCount.waitWrite}}</span></div>
						</a>
						<a href="udai_collection.html" class="user-nav__but">
							<i class="iconfont icon-star fz40 cr"></i>
							<div class="c6">收藏 <span class="c3">0</span></div>
						</a>
						<a href="udai_coupon.html" class="user-nav__but">
							<i class="iconfont icon-quan fz40 cr"></i>
							<div class="c6">优惠券 <span class="cr">2</span></div>
						</a>
						<a href="udai_integral.html" class="user-nav__but">
							<i class="iconfont icon-jifen fz40 cr"></i>
							<div class="c6">积分 <span class="cr" >{{user.score}}</span></div>
						</a>
						<a href="udai_message.html" class="user-nav__but">
							<i class="iconfont icon-xiaoxi fz40 cr"></i>
							<div class="c6">消息 <span class="cr">2</span></div>
						</a>
					</div>
				</div>
				<div class="order-list__div bgf">
					<div class="user-title">
						我的订单<span class="c6">（显示最新三条）</span>
						<a href="uorder.html" target="right" class="pull-right">查看所有订单></a>
					</div>
					<div class="order-panel">
						<ul class="nav user-nav__title" role="tablist">
							<li role="presentation" class="nav-item active"><a href="#all" @click="orderList(0)" aria-controls="all" role="tab" data-toggle="tab">所有订单</a></li>
							<li role="presentation" class="nav-item "><a href="#pay"  @click="orderList(1)" aria-controls="pay" role="tab" data-toggle="tab">待付款 <span class="cr">{{orderCount.waitPay}}</span></a></li>
							<li role="presentation" class="nav-item "><a href="#emit" @click="orderList(2)" aria-controls="emit" role="tab" data-toggle="tab">待发货 <span class="cr">{{orderCount.waitSend}}</span></a></li>
							<li role="presentation" class="nav-item "><a href="#take" @click="orderList(3)" aria-controls="take" role="tab" data-toggle="tab">待收货 <span class="cr">{{orderCount.waitReceive}}</span></a></li>
							<li role="presentation" class="nav-item "><a href="#eval" @click="orderList(4)"  aria-controls="eval" role="tab" data-toggle="tab">待评价 <span class="cr">{{orderCount.waitWrite}}</span></a></li>
						</ul>

						<div class="tab-content">
							<div role="tabpanel" class="tab-pane fade in active" id="all">
								<table class="table text-center">
									<tr>
										<th width="380">商品信息</th>
										<th></th>
										<th></th>
										<th width="120">实付款</th>
										<th width="120">交易状态</th>
										<th width="120">交易操作</th>
									</tr>
									<tbody  v-for="(order,index) in orders" v-if="index<3">
									<tr class="order-item" v-if="order.status=='1'"  >
										<td>
											<label>
												<a :href="'uorder_detail.html?id='+order.id" target="right" class="num">
													{{order.createDate}} 订单号: {{order.orderNo}}
												</a>
												<div class="card" v-for="(items,i) in order.orderitems" v-if=" i<1 ">
													<div class="img"><img :src="items.goodsinfo.coverPath" alt="" class="cover"></div>
													<div class="name ep2">{{items.name}}</div>
													<div class="format">颜色分类：深棕色  尺码：{{items.goodsinfo.stock}}</div>
													<div class="favour">使用优惠券：优惠¥2.00</div>
												</div>
											</label>
										</td>
										<td></td>
										<td></td>
										<td>￥{{order.payMoney}}<br><span class="fz12 c6 text-nowrap">(含运费: ¥0.00)</span></td>
										<td class="state">
											<a class="but c6">等待付款</a>
											<a :href="'uorder_detail.html?id='+order.id" target="right">订单详情</a>
										</td>
										<td class="order">
											<div class="del" @click="del(order.id)"><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></div>
											<a href="udai_shopcart_pay.html" class="but but-primary">立即付款</a>
											<!-- <a href="" class="but but-link">评价</a> -->
											<a  class="but c3"  href="javascript:void(0)" @click="cancelOrder(order.id)">取消订单</a>
										</td>
									</tr>

									<tr class="order-item" v-if="order.status=='7'"  >
										<td>
											<label>
												<a :href="'uorder_detail.html?id='+order.id" target="right" class="num">
													{{order.createDate}} 订单号: {{order.orderNo}}
												</a>
												<div class="card" v-for="(items,i) in order.orderitems" v-if=" i<1 ">
													<div class="img"><img :src="items.goodsinfo.coverPath" alt="" class="cover"></div>
													<div class="name ep2">{{items.name}}</div>
													<div class="format">颜色分类：深棕色  尺码：{{items.goodsinfo.stock}}</div>
													<div class="favour">使用优惠券：优惠¥2.00</div>
												</div>
											</label>
										</td>
										<td></td>
										<td></td>
										<td>￥{{order.payMoney}}<br><span class="fz12 c6 text-nowrap">(含运费: ¥0.00)</span></td>
										<td class="state">
											<a class="but c6">已取消</a>
											<a :href="'uorder_detail.html?id='+order.id" target="right" class="but c9">订单详情</a>
										</td>
										<td class="order">
											<div class="del" @click="del(order.id)"><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></div>
										</td>
									</tr>





									<tr class="order-item" v-if="order.status=='3'|| order.status=='2'" >
										<td>
											<label>
												<a :href="'uorder_detail.html?id='+order.id" target="right" class="num">
													{{order.createDate}} 订单号: {{order.orderNo}}
												</a>
												<div class="card" v-for="(items,i) in order.orderitems" v-if=" i<1 ">
													<div class="img"><img :src="items.goodsinfo.coverPath" alt="" class="cover"></div>
													<div class="name ep2">{{items.name}}</div>
													<div class="format">颜色分类：深棕色  尺码：{{items.goodsinfo.stock}}</div>
													<div class="favour">使用优惠券：优惠¥2.00</div>
												</div>
											</label>
										</td>
										<td></td>
										<td></td>
										<td>￥{{order.payMoney}}<br><span class="fz12 c6 text-nowrap">(含运费: ¥0.00)</span></td>
										<td class="state">
											<a class="but c6">等待收货</a>
											<a :href="'uorder_detail.html?id='+order.id" target="right" class="but c9">订单详情</a>
										</td>
										<td class="order">
											<a :href="'uorder_receipted.html?id='+order.id" class="but but-primary">确认收货</a>
											<!-- <a href="" class="but but-link">评价</a> -->
											<a href="udai_apply_return.html" class="but c3">退款/退货</a>
										</td>
									</tr>
									<tr class="order-item" v-if="order.status=='4'">
										<td>
											<label>
												<a :href="'uorder_detail.html?id='+order.id" target="right" class="num">
													{{order.createDate}} 订单号: {{order.orderNo}}
												</a>
												<div class="card" v-for="(items,i) in order.orderitems" v-if=" i<1 ">
													<div class="img"><img :src="items.goodsinfo.coverPath" alt="" class="cover"></div>
													<div class="name ep2">{{items.name}}</div>
													<div class="format">颜色分类：深棕色  尺码：{{items.goodsinfo.stock}}</div>
													<div class="favour">使用优惠券：优惠¥2.00</div>
												</div>
											</label>
										</td>
										<td></td>
										<td></td>
										<td>￥{{order.payMoney}}<br><span class="fz12 c6 text-nowrap">(含运费: ¥0.00)</span></td>
										<td class="state">
											<a class="but c6">交易成功</a>
											<a :href="'uorder_detail.html?id='+order.id" target="right" class="but c9">订单详情</a>
										</td>
										<td class="order">
											<div class="del" @click="del(order.id)"><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></div>
											<a href="" class="but but-link">评价</a>
										</td>
									</tr>

									</tbody>
									<tr class="order-empty"   v-if="orders.length<1">
										<td colspan='6'>
											<div class="empty-msg">最近没有任何订单，家里好像缺了点什么！<br><a href="item_category.html">要不瞧瞧去？</a></div>
										</td>

									</tr>

								</table>
							</div>

<!--							待付款-->
							<div role="tabpanel" class="tab-pane fade" id="pay">
								<table class="table text-center">
									<tr>
										<th width="380">商品信息</th>
										<th></th>
										<th></th>
										<th width="120">实付款</th>
										<th width="120">交易状态</th>
										<th width="120">交易操作</th>
									</tr>

									<tr class="order-item" v-for="(order,index) in orders" v-if="index<3">
										<td>
											<label>
												<a :href="'uorder_detail.html?id='+order.id" target="right" class="num">
													{{order.createDate}} 订单号: {{order.orderNo}}
												</a>
												<div class="card" v-for="(items,i) in order.orderitems" v-if=" i<1 ">
													<div class="img"><img :src="items.goodsinfo.coverPath" alt="" class="cover"></div>
													<div class="name ep2">{{items.name}}</div>
													<div class="format">颜色分类：深棕色  尺码：{{items.goodsinfo.stock}}</div>
													<div class="favour">使用优惠券：优惠¥2.00</div>
												</div>
											</label>
										</td>
										<td></td>
										<td></td>
										<td>￥{{order.payMoney}}<br><span class="fz12 c6 text-nowrap">(含运费: ¥0.00)</span></td>
										<td class="state">
											<a class="but c6">等待付款</a>
											<a :href="'uorder_detail.html?id='+order.id" target="right" class="but c9">订单详情</a>
										</td>
										<td class="order">
											<div class="del" @click="del(order.id)"><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></div>
											<a href="udai_shopcart_pay.html" class="but but-primary">立即付款</a>
											<!-- <a href="" class="but but-link">评价</a> -->
											<a  href="javascript:void(0)" @click="cancelOrder(order.id)" class="but c3">取消订单</a>
										</td>
									</tr>

									<tr class="order-empty"   v-if="orders.length<1">
										<td colspan='6'>
										<div class="empty-msg">最近没有任何订单，家里好像缺了点什么！<br><a href="item_category.html">要不瞧瞧去？</a></div>
										</td>

									</tr>

								</table>
							</div>

<!--							待发货-->
							<div role="tabpanel" class="tab-pane fade" id="emit">
								<table class="table text-center">
									<tr>
										<th width="380">商品信息</th>
										<th></th>
										<th></th>
										<th width="120">实付款</th>
										<th width="120">交易状态</th>
										<th width="120">交易操作</th>
									</tr>
									<tr class="order-item" v-for="(order,index) in orders" v-if="index<3" >
										<td>
											<label>
												<div class="num">
													<!-- <input type="checkbox"> -->
													{{order.createDate}} 订单号: {{order.orderNo}}
												</div>
												<div class="card" v-for="(items,i) in order.orderitems" v-if=" i<1 ">
													<div class="img"><img :src="items.goodsinfo.coverPath" alt="" class="cover"></div>
													<div class="name ep2">{{items.name}}</div>
													<div class="format">{{items.goodsinfo.stock}}</div>
												</div>
											</label>
										</td>
										<td></td>
										<td></td>
										<td>￥{{order.payMoney}}<br><span class="fz12 c6 text-nowrap">(含运费: ¥0.00)</span></td>
										<td class="state">
											<a class="but c6">等待付款</a>
											<a :href="'uorder_detail.html?id='+order.id" target="right" class="but c9">订单详情</a>
										</td>
										<td class="order">
											<div class="del"><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></div>
											<a href="uorder_receipted.html" class="but but-primary">提醒发货</a>
											<a href="udai_apply_return.html" class="but c3">退款/退货</a>
										</td>
									</tr>

									<tr class="order-empty"   v-if="orders.length<1">
										<td colspan='6'>
											<div class="empty-msg">最近没有任何订单，家里好像缺了点什么！<br><a href="item_category.html">要不瞧瞧去？</a></div>
										</td>

									</tr>

								</table>
							</div>

<!--							待收货-->
							<div role="tabpanel" class="tab-pane fade" id="take">
								<table class="table text-center">
									<tr>
										<th width="380">商品信息</th>
										<th></th>
										<th></th>
										<th width="120">实付款</th>
										<th width="120">交易状态</th>
										<th width="120">交易操作</th>
									</tr>
									<tr class="order-item" v-for="(order,index) in orders" v-if="index<3" >
										<td>
											<label>
												<div class="num">
													<!-- <input type="checkbox"> -->
													{{order.createDate}} 订单号: {{order.orderNo}}
												</div>
												<div class="card" v-for="(items,i) in order.orderitems" v-if=" i<1 ">
													<div class="img"><img :src="items.goodsinfo.coverPath" alt="" class="cover"></div>
													<div class="name ep2">{{items.name}}</div>
													<div class="format">：{{items.goodsinfo.stock}}</div>
												</div>
											</label>
										</td>
										<td></td>
										<td></td>
										<td>￥{{order.payMoney}}<br><span class="fz12 c6 text-nowrap">(含运费: ¥0.00)</span></td>
										<td class="state">
											<a class="but c6">等待付款</a>
											<a :href="'uorder_detail.html?id='+order.id" target="right" class="but c9">订单详情</a>
										</td>
										<td class="order">
											<a href="udai_shopcart_pay.html" class="but but-primary">立即付款</a>
											<!-- <a href="" class="but but-link">评价</a> -->
											<a href="" class="but c3">取消订单</a>
										</td>
									</tr>

									<tr class="order-empty"   v-if="orders.length<1">
										<td colspan='6'>
											<div class="empty-msg">最近没有任何订单，家里好像缺了点什么！<br><a href="item_category.html">要不瞧瞧去？</a></div>
										</td>

									</tr>
								</table>
							</div>

<!--							待评价-->
							<div role="tabpanel" class="tab-pane fade" id="eval">
								<table class="table text-center">
									<tr>
										<th width="380">商品信息</th>
										<th></th>
										<th></th>
										<th width="120">实付款</th>
										<th width="120">交易状态</th>
										<th width="120">交易操作</th>
									</tr>
									<tr class="order-item" v-for="(order,index) in orders" v-if="index<3" >
										<td>
											<label>
												<div class="num">
													<!-- <input type="checkbox"> -->
													{{order.createDate}} 订单号: {{order.orderNo}}
												</div>
												<div class="card" v-for="(items,i) in order.orderitems" v-if=" i<1 ">
													<div class="img"><img :src="items.goodsinfo.coverPath" alt="" class="cover"></div>
													<div class="name ep2">{{items.name}}</div>
													<div class="format">{{items.goodsinfo.stock}}</div>
												</div>
											</label>
										</td>
										<td></td>
										<td></td>
										<td>￥{{order.payMoney}}<br><span class="fz12 c6 text-nowrap">(含运费: ¥0.00)</span></td>
										<td class="state">
											<a class="but c6">等待付款</a>
											<a :href="'uorder_detail.html?id='+order.id" target="right" class="but c9">订单详情</a>
										</td>
										<td class="order">
											<a href="udai_shopcart_pay.html" class="but but-primary">立即付款</a>
											<!-- <a href="" class="but but-link">评价</a> -->
											<a href="" class="but c3">取消订单</a>
										</td>
									</tr>

									<tr class="order-empty"   v-if="orders.length<1">
										<td colspan='6'>
											<div class="empty-msg">最近没有任何订单，家里好像缺了点什么！<br><a href="item_category.html">要不瞧瞧去？</a></div>
										</td>

									</tr>
								</table>
							</div>
						</div>
					</div>
				</div>



				
				<div class="recommends">
					<div class="lace-title type-2">
						<span class="cr">爆款推荐</span>
					</div>
					<div class="swiper-container recommends-swiper">
						<div class="swiper-wrapper">
							<div class="swiper-slide">
								<a class="picked-item" href="">
									<img src="images/temp/S-001-1_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
								<a class="picked-item" href="">
									<img src="images/temp/S-001-2_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
								<a class="picked-item" href="">
									<img src="images/temp/S-001-3_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
								<a class="picked-item" href="">
									<img src="images/temp/S-001-4_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
								<a class="picked-item" href="">
									<img src="images/temp/S-001-5_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
							</div>
							<div class="swiper-slide">
								<a class="picked-item" href="">
									<img src="images/temp/S-001-1_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
								<a class="picked-item" href="">
									<img src="images/temp/S-001-2_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
								<a class="picked-item" href="">
									<img src="images/temp/S-001-3_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
								<a class="picked-item" href="">
									<img src="images/temp/S-001-4_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
								<a class="picked-item" href="">
									<img src="images/temp/S-001-5_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
							</div>
							<div class="swiper-slide">
								<a class="picked-item" href="">
									<img src="images/temp/S-001-1_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
								<a class="picked-item" href="">
									<img src="images/temp/S-001-2_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
								<a class="picked-item" href="">
									<img src="images/temp/S-001-3_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
								<a class="picked-item" href="">
									<img src="images/temp/S-001-4_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
								<a class="picked-item" href="">
									<img src="images/temp/S-001-5_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
							</div>
							<div class="swiper-slide">
								<a class="picked-item" href="">
									<img src="images/temp/S-001-1_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
								<a class="picked-item" href="">
									<img src="images/temp/S-001-2_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
								<a class="picked-item" href="">
									<img src="images/temp/S-001-3_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
								<a class="picked-item" href="">
									<img src="images/temp/S-001-4_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
								<a class="picked-item" href="">
									<img src="images/temp/S-001-5_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
							</div>
							<div class="swiper-slide">
								<a class="picked-item" href="">
									<img src="images/temp/S-001-3_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
								<a class="picked-item" href="">
									<img src="images/temp/S-001-4_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
								<a class="picked-item" href="">
									<img src="images/temp/S-001-5_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
								<a class="picked-item" href="">
									<img src="images/temp/S-001-5_s.jpg" alt="" class="cover">
									<div class="look_price">¥134.99</div>
								</a>
							</div>
						</div>
					</div>

				</div>
	</div>
</div>
<script>
	$(document).ready(function(){
		var recommends = new Swiper('.recommends-swiper', {
			spaceBetween : 40,
			autoplay : 5000,
		});
	});
</script>
</body>
</html>